﻿@model  DHQGHN.DAL.Common.DataPage<DHQGHN.PM2.Models.DHQG.UserInGroupModel>
@{
    var pagNar = ViewBag.Pagination as DHQGHN.DAL.Common.Pagination;
    var lstItem = Model.Data;
    //var groupName = "";
    //foreach (var group in ViewBag.lstGroup)
    //{
    //    if (Equals(group.Value, @ViewBag.groupId))
    //    {
    //        groupName = group.Text;
    //    }
    //}
}
<table class="webGrid table table-striped table-bordered table-hover dataTable no-footer" id="ds_nhom_don_vi">
    <thead>
        <tr class="header">
            <th scope="col" style="width:45px; text-align: center;" >
                STT
            </th>
            <th scope="col" style="max-width: 300px; min-width: 50px; width: 50px; text-align: center;">
                Chọn
            </th>
            <th scope="col" class="hidden-480" style="text-align: center;">
                Tên đăng nhập
            </th>
            <th scope="col" class="hidden-320" style="text-align: center;">
                Họ và tên
            </th>
            <th scope="col" class="hidden-480" style="text-align: center;">
                Email
            </th>

        </tr>
    </thead>
    <tbody>
        @if (Model != null && Model.Data.Any())
        {
            for (int i = 0; i < lstItem.Count; i++)
            {
            <tr class="webgrid-row-style">
                <td class="clsSTT" style="text-align: center;">
                    <span>@(i + 1 + pagNar.CurrentPage * pagNar.PageSize)</span>
                </td>
                <td style="text-align:center">
                    <div id="checkboxUserInGroup">
                        <input type="checkbox" name="@lstItem[i].UserInGroupId" />
                    </div>
                </td>
                <td class="clsUserName hidden-480">
                    <span id="spnUserName" class="display-mode">
                        @lstItem[i].Username
                    </span>
                </td>
                <td>
                    <span id="spnFullName" class="display-mode">
                        @lstItem[i].Fullname
                    </span>

                </td>

                <td class="clsUserName hidden-480">
                    <span id="spnEmail" class="display-mode">
                        @lstItem[i].Email
                    </span>
                </td>
            </tr>
            }
        }
        else
        {
            <tr>
                <td colspan="9"><p style="width: 100%; text-align:center;">Chưa gán người dùng cho nhóm</p></td>
            </tr>
        }
    </tbody>
    @if (Model != null && Model.Data.Any())
    {
        <tfoot>
            <tr>
                <td colspan="9" style="text-align:left;height:25px">
                    <button type="button" class="btn btn-danger" title="Xóa người dùng khỏi nhóm" id="btnDelete" style="height: 25px; margin-top: 5px; padding-top: 3px;">
                       Xóa
                    </button>
                </td>
            </tr>
            <tr>
                <td colspan="9">
                    @if (Model.Data.Any())
                    {
                        @Html.Partial("_PaginationView", pagNar)
                    }
                </td>
            </tr>
        </tfoot>
    }


</table>

<div id="navigate_bottom_panel" class="nav-bottom ">
</div>
<div id="user-in-group-model-container"></div>
<script>
    @functions{
            public string GetAntiForgeryToken()
            {
                string cookieToken, formToken;
                AntiForgery.GetTokens(null, out cookieToken, out formToken);
                return cookieToken + "," + formToken;
            }
        }
</script>

<script type="text/javascript">
    var crrPageIndex;
    function OnCriteria(pageIndex) {
        var code = $('#group-list');
        crrPageIndex = pageIndex;
        code = code != null ? code.val().trim() : "";
        $.ajax({
            dataType: "html",
            type: "POST",
            url: '/UserInGroup/actionSearch',
            contentType: "application/json",
            data: JSON.stringify({ pageIndex: pageIndex, aModel: { GroupId: code } }),
            success: function (response) {
                var $catlist = $('#user-in-group-list');

                if ($catlist == null || $catlist.length == 0) {
                    window.notice('@*@Resources.Localization.MsgItemNotFound*@', window.notice_error);
                }
                else {
                    $catlist.html(response);
                }
            }
        });
        setTimeout(function () { $('#search_form').find('input:text:visible:first').focus(); }, 500);
    }


    $(document).ready(function () {
        $('.user-in-group-add').bind('click', function (event) {
            var $self = $(this);
            $.post("/UserInGroup/actionPrepareCreateOrUpdateUserInGroup", { id: -1, groupID: $self.attr('data-id') }, function (data) {
                var $userModel = $('#user-in-group-model-container');
                $userModel.html(data);
                $('#UserInGroupModal').modal({
                    keyboard: true
                });
            }, "html");
        });

        function actionDelete() {
            var values = [];
            $('#checkboxUserInGroup input:checked').each(function () {
                values.push(this.name);
            });

            var box = bootbox.dialog({
                title: "Xóa người dùng",
                message: "Bạn có chắc chắn muốn xóa không?",
                onEscape: function () {
                    box.modal('hide');
                },
                buttons: {
                    success: {
                        label: "<i class='fa fa-warning'></i> Xóa",
                        className: "btn btn-sm btn-danger", //btn-success
                        callback: function () {
                            $.ajax({
                                url: '/UserInGroup/actionDelete',
                                headers: {
                                    'VerificationToken': '@GetAntiForgeryToken()'
                                },
                                data: JSON.stringify({
                                    id: values
                                }),
                                dataType: 'json',
                                type: 'post',
                                contentType:'application/json',
                                success: function (response) {
                                    if (response != null && response.status == 200) {
                                        Layout.toastr("", response.result);
                                        OnCriteria(crrPageIndex);
                                        result = true;
                                    } else {
                                        Layout.toastr("", response.result);
                                    }
                                },
                                complete: function () {

                                },
                                error: function (ex) {
                                    alert(JSON.stringify(ex));
                                }
                            });

                        }
                    },
                    danger: {
                        label: "<i class='fa fa-reply'></i> Hủy bỏ",
                        className: "btn btn-sm btn-default",//"btn-danger",
                        callback: function () {
                        }
                    }
                }
            });
        }

        $('#btnDelete').click(function (e) {
            var values = [];
            $('#checkboxUserInGroup input:checked').each(function () {
                values.push(this.name);
            });

            if (values.length) {
                actionDelete();
            } else {
                warning("Bạn cần chọn người dùng để xóa !", "Xóa người dùng");
            }
        });
    });
</script>
